<template>
  <div class="product-head1">
    <h1 class="product-head__title kaiti">实时财务数据和自定义报表</h1>
    <h2 class="product-head__sub-title">实时了解您的业务数据，而不是等到月末15天后看到您的收入和支出</h2>
  </div>
  <div class="introduce_container">
    <div class="introduce introduce__right">
      <img id="introduce_0" class="image" style="width: 250px;height: 250px" src="@assets/images/751.png" alt="纷析云财务">
      <p class="desc">通过实时记账更快地了解您的业务健康状况</p>
      <p class="content">纷析云会计自动化工具、解决重复的记账和对账任务、实时查看您的盈利能力.</p>
    </div>
  </div>

  <div class="function-title">纷析云能做什么？</div>
  <div class="function-section  function-section--0
        function-section--icon-left">

    <div class="function-section__content">
      <div class="function-section__desc-container">
        <div class="function-section__desc">
          <h2 class="function-section__desc-title">收入对账平台</h2>


          <p class="function-section__desc-item">数据采集、对接主流收银系统</p>
          <p class="function-section__desc-item">应收数据、自动映射、批量导入</p>
          <p class="function-section__desc-item">银行到账、自动匹配、一键生成凭证</p>
        </div>
      </div>

      <div class="image-container function-section__icon-container">
        <span class="image-helper"></span>
        <img class="image" src="@assets/images/1416.png" style="width: 250px;height: 250px" alt="收入对账">
      </div>
    </div>

  </div>
  <div class="function-section  function-section--1
        function-section--light">

    <div class="function-section__content">
      <div class="function-section__desc-container">
        <div class="function-section__desc">
          <h2 class="function-section__desc-title">成本核算</h2>

          <p class="function-section__desc-item">物料管理、物料库存管理，供应商管理</p>
          <p class="function-section__desc-item">物料出入库、调拔、盘点</p>
          <p class="function-section__desc-item">物料损益表、物料明细表、物料进销存</p>
        </div>
      </div>

      <div class="image-container function-section__icon-container">
        <span class="image-helper"></span>
        <img class="" src="@assets/images/252.png" alt="云库存" style="width: 250px;height: 250px">
      </div>
    </div>

  </div>
  <div class="function-section  function-section--2 function-section--icon-left">

    <div class="function-section__content">
      <div class="function-section__desc-container">
        <div class="function-section__desc">
          <h2 class="function-section__desc-title">报销自动化</h2>


          <p class="function-section__desc-item">对接钉钉、企业微信报销流程</p>
          <p class="function-section__desc-item">对接银企直连、提升报销效率</p>
          <p class="function-section__desc-item">对接主流财务软件、一键生成凭证</p>
        </div>
      </div>

      <div class="image-container function-section__icon-container">
        <span class="image-helper"></span>
        <img class="" src="@assets/images/1421.png" alt="报销自动化" style="width: 250px;height: 250px">
      </div>
    </div>

  </div>

</template>

<script>
/**
 * <p>****************************************************************************</p>
 * <p><b>Copyright © 2010-2023 soho team All Rights Reserved<b></p>
 * <ul style="margin:15px;">
 * <li>Description : </li>
 * <li>Version     : 1.0</li>
 * <li>Creation    : 2023年02月12日</li>
 * <li>@author     : ____′↘夏悸</li>
 * </ul>
 * <p>****************************************************************************</p>
 */
export default {
  name: "CloudFinance"
}
</script>

<style scoped>
.tip {
  padding: 12px 24px 12px 20px;
  margin: 2em 0;
  border-left-width: 4px;
  border-left-style: solid;
  background-color: #f8f8f8;
  position: relative;
  border-bottom-right-radius: 2px;
  border-top-right-radius: 2px;
  border-left-color: #f66
}

.tip:before {
  content: "!";
  background-color: #f66;
  position: absolute;
  top: 14px;
  left: -12px;
  color: #fff;
  width: 20px;
  height: 20px;
  border-radius: 100%;
  text-align: center;
  line-height: 20px;
  font-weight: 700
}
</style>
